<extend name='./Base' />
<block name='css'><link rel="stylesheet" href="__PUBLIC__/static/admin/wangEditor/css/wangEditor.min.css">
<link rel="stylesheet" type="text/css" href="__PUBLIC__/static/highlightJS/styles/<?php echo !isset(F('webSet')['codestyle'])?'solarized_dark':F('webSet')['codestyle'];?>.css">
<link rel="stylesheet" href="__PUBLIC__/static/admin/uploadifive/uploadifive.css">
<link rel="stylesheet" href="__PUBLIC__/static/admin/tags/jquery.tagsinput.css">
<style>
  .uploadifive-button{border:none; border-radius:1px; height: 28px;background:#3bb4f2;color:#fff;}
  .wangEditor-container .wangEditor-txt pre{padding: 0}
</style>
</block>
<block name='admin-content-body'>
<div class="admin-content-body">
      <div class="am-cf am-padding am-padding-bottom-0">
        <div class="am-fl am-cf"><strong class="am-text-primary am-text-lg">修改文章</strong> / <small>Edit</small></div>
      </div>

      <hr>

      <div class="am-g">
        <div class="am-u-sm-12">
          <form class="am-form" method="post" id="articleForm">
            <div class="am-g am-margin-top">
              <div class="am-u-sm-4 am-u-md-2 am-text-right">
                文章标题
              </div>
              <div class="am-u-sm-8 am-u-md-4">
                <input type="text" class="am-input-sm" name="title" id="title" value="{$article['title']}">
              </div>
              <div class="am-hide-sm-only am-u-md-6">*必填</div>
            </div>

            <div class="am-g am-margin-top">
              <div class="am-u-sm-4 am-u-md-2 am-text-right">
                是否置顶
              </div>
              <div class="am-u-sm-8 am-u-md-4">
                <div class="am-btn-group" data-am-button>
                  <label class="am-btn am-btn-default am-btn-xs <?php echo $article['is_banner']==1?'am-active':'';?> ">
                    <input type="radio" name="isBanner" <?php echo $article['is_banner']==1?'checked="checked"':'';?> id="option1" value="1">是
                  </label>
                  <label class="am-btn am-btn-default am-btn-xs <?php echo $article['is_banner']==0?'am-active':'';?>">
                    <input type="radio" name="isBanner" <?php echo $article['is_banner']==0?'checked="checked"':'';?> id="option2" value="0"> 否
                  </label>
                </div>
              </div>
              <div class="am-hide-sm-only am-u-md-6">*必填</div>
            </div>

            <div class="am-g am-margin-top">
              <div class="am-u-sm-4 am-u-md-2 am-text-right">
                文章封面
              </div>
              <div class="am-u-sm-8 am-u-md-4">
                <input type="hidden" class="am-input-sm" readonly name="cover" id="coverpath" value="<empty name="article.cover"><empty name="article.banner"><else />{$article['banner']}</empty><else />{$article['cover']}</empty>">
                <input id="cover_upload" type="file" name="cover" />
                                <div id="tip-queue" class="col-xs-4" style="display: none"></div><br>
                                <div style="position: relative;">
                                <img 
                                <empty name="article.cover"> 
                                  <empty name="article.banner"> 
                                    src="__PUBLIC__/static/admin/i/1.jpg"
                                  <else />
                                    src="{$article['banner']}"
                                  </empty>
                                <else />
                                  src="{$article['cover']}"
                                </empty> 
                                alt="cover" id="shoCover" class="am-img-thumbnail" style='max-height:125px'>
                                <button style="position: absolute;top:-10px;" onclick="deleteImg()" type="button" class="am-close">&times;</button>
                                </div>
              </div>
              <div class="am-hide-sm-only am-u-md-6">*必填</div>
            </div>

            <div class="am-g am-margin-top">
              <div class="am-u-sm-4 am-u-md-2 am-text-right">
                文章分类
              </div>
              <div class="am-u-sm-8 am-u-md-4 am-u-end col-end">
                <select data-am-selected="{btnSize: 'sm'}" name="category_id" id="category_id">
                  <option value="">选择分类</option>
                  <foreach name='categories' item='v'>
                  <option value="{$v['id']}" <if condition="$article['category_id'] eq $v['id']">selected="selected"</if>>{$v['category']}</option>
                  </foreach>
                </select>
              </div>
              <div class="am-hide-sm-only am-u-md-6">*必填</div>
            </div>

            <div class="am-g am-margin-top">
              <div class="am-u-sm-4 am-u-md-2 am-text-right">
                标签
              </div>
              <div class="am-u-sm-8 am-u-md-4">
                <input type="text" class="am-input-sm" name="tags" id="tags" value="{$article['tags']}">
              </div>
              <div class="am-hide-sm-only am-u-md-6"> *必填 &nbsp;&nbsp;&nbsp; 提示：输入一个后回车</div>
            </div>
            <input type="hidden" name="id" id="aid" value="{$article['id']}">
            <input type="hidden" name="acid" id="acid" value="{$article['acid']}">

            <div class="am-g am-margin-top-sm">
              <div class="am-u-sm-12 am-u-md-2 am-text-right admin-form-text">
                文章内容
              </div>
              <div class="am-u-sm-12 am-u-md-10">
                <textarea id="editor-trigger" name="content" style="display:none;" rows="20">{$article['content']}</textarea>
              </div>
            </div>
            <hr>
            <div class="am-u-md-10 am-u-md-offset-2">
            <button type="submit" class="am-btn am-btn-primary am-btn-xs">提交保存</button>
            <a href="{:U('__CONTROLLER__/add')}" class="am-btn am-btn-primary am-btn-xs">放弃保存</a>
          </div>
          </form>
        </div>

      </div>
    </div>

</block>

<block name="js">
  <script src="__PUBLIC__/static/admin/uploadifive/jquery.uploadifive.js"></script>
	<script src="__PUBLIC__/static/admin/wangEditor/wangEditor.min.js"></script>
    <script src="__PUBLIC__/static/admin/tags/jquery.tagsinput.min.js"></script>
      <script type="text/javascript">
      //tags
      $('#tags').tagsInput({width:'auto'});
        //uploadifive
        $(function(){
            $('#cover_upload').uploadifive({
                'formData'     : {'type':'cover'},
                'uploadScript' : "{:U('upload/uploadimage')}",
                'multi':false,
                'buttonText'   : '选择图片',   //按钮显示文字
                'queueID'      : 'tip-queue', //提示信息放置目标
                'fileType'     : 'image/*',   //允许上传文件类型
                'onSelect': function (file) {
                    layer.load(1);
                },
                'onUploadComplete': function(file,data,response){
                    layer.closeAll('loading');
                    data= $.parseJSON(data);
                    if(!data.status){
                        alert(data.msg);
                    }else{
                        layer.msg('图片上传完毕');
                        $("#coverpath").val(data.msg);
                        $("#shoCover").attr('src',data.msg);
                    }

                }
            });
        });

        function deleteImg(){
          var cover=$('#coverpath').val();
          if(cover != ''){
            layer.confirm('确定要删除图片？', {
              btn: ['确定','取消']
            },function(){
                $.post('{:U("articles/deleteImg")}',{'cover':cover},function(res){
                if(res.status){
                  $('#coverpath').val('');
                  $("#shoCover").attr('src','__PUBLIC__/static/admin/i/1.jpg');
                  layer.msg(res.msg);
                }else{
                  layer.alert(res.msg,{icon:5});
                }
              })
            },function(){});
          }
        }


      </script>
      <script type="text/javascript">
        // 阻止输出log
        wangEditor.config.printLog = false;

        var editor = new wangEditor('editor-trigger');

        // 上传图片
        editor.config.uploadImgUrl = "{:U('upload/uploadimage')}";
        
        editor.config.uploadHeaders = {
             'Accept' : 'image/*'
        };
         editor.config.uploadImgFileName = 'Filedata';

        // 隐藏网络图片
        // editor.config.hideLinkImg = true;

        // 表情显示项
        editor.config.emotionsShow = 'value';
        editor.config.emotions = {
            'default': {
                title: '默认',
                data: "__PUBLIC__/static/admin/wangEditor/emotions.data"
            },
            'weibo': {
                title: '微博表情',
                data: [
                    {
                        icon: 'http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/7a/shenshou_thumb.gif',
                        value: '[草泥马]'
                    },
                    {
                        icon: 'http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/60/horse2_thumb.gif',
                        value: '[神马]'
                    },
                    {
                        icon: 'http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/bc/fuyun_thumb.gif',
                        value: '[浮云]'
                    },
                    {
                        icon: 'http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/c9/geili_thumb.gif',
                        value: '[给力]'
                    },
                    {
                        icon: 'http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/f2/wg_thumb.gif',
                        value: '[围观]'
                    },
                    {
                        icon: 'http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/70/vw_thumb.gif',
                        value: '[威武]'
                    }
                ]
            }
        };
        // 普通菜单配置
         editor.config.menus = ['source','|','bold','underline','italic','strikethrough','eraser','forecolor',
             'bgcolor','|','quote','fontfamily','fontsize','head','unorderlist','orderlist','alignleft','aligncenter',
             'alignright','|','link','unlink','table','emotion','|','img','video','location','insertcode','|','undo','fullscreen'];
        // 自定义load事件
        editor.config.uploadImgFns.onload = function (resultText, xhr) {
            // resultText 服务器端返回的text
            // xhr 是 xmlHttpRequest 对象，IE8、9中不支持
            resultText= $.parseJSON(resultText);
            // 如果 resultText 是图片的url地址，可以这样插入图片：
            if(resultText.status){
              // 如果 resultText 是图片的url地址，可以这样插入图片：
              editor.command(null, 'insertHtml', '<img src="' + resultText.msg + '" style="max-width:100%;"/>');
            }else{
              alert(resultText.msg);
            }
            // 如果不想要 img 的 max-width 样式，也可以这样插入：
            // editor.command(null, 'InsertImage', resultText);
        };
        // 自定义timeout事件
        editor.config.uploadImgFns.ontimeout = function (xhr) {
            // xhr 是 xmlHttpRequest 对象，IE8、9中不支持
            alert('上传超时');
        };

        // 自定义error事件
        editor.config.uploadImgFns.onerror = function (xhr) {
            // xhr 是 xmlHttpRequest 对象，IE8、9中不支持
            alert('上传错误');
        };
        editor.create();

        $("#articleForm").submit(function () {
            layer.msg('提交中', {
                icon: 16
                ,shade: 0.01
            });
             var radio = document.getElementsByName("isBanner");  
            var isBanner=0;
            for (i=0; i<radio.length; i++) {  
                if (radio[i].checked) {  
                  isBanner=radio[i].value;
                }  
            } 
            var content=editor.$txt.html();
            var category_id=$("#category_id").val();
            var title=$('#title').val();
            var tags=$('#tags').val();
            var cover=$('#coverpath').val();
            var id=$('#aid').val();
            var acid=$('#acid').val();
            if(isBanner==1){
              if(cover==''){
                layer.msg('没有上传图');
                return false;
              }
            }
            if(content=='' || title=='' || category_id=='' || tags==''){
                layer.msg('有未填写项');
            }else{
                $.post('{:U("__ACTION__")}',
                  {'title':title,'content':content,'tags':tags,'category_id':category_id,'cover':cover,'id':id,'acid':acid,'is_banner':isBanner},
                   function (res) {
                    if(res.status){
                        layer.msg(res.msg);
                    }else{
                        layer.alert(res.msg,{icon:5});
                    }
                })
            }
            return false;
        });

    </script>
</block>